{include file="include/top"}
<body>
<div class="layui-fluid">
    <div class="layui-row">
        <form class="layui-form layui-table" action="javascript:;" >
            <div class="layui-form-item">
                <label for="username" class="layui-form-label">
                    <span class="x-red">*</span>用户组名
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="title" name="title" required="" lay-verify="required"
                           autocomplete="off" class="layui-input" value="{$data.title}">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"><span class="x-red">*</span>选择权限</label>
                <div class="layui-input-block">
                    {volist name="auth_rule" id="tmp"}
                    <div class="form-group">
                        <input type="checkbox" lay-skin="primary" onclick="quanxuan(this)" lay-filter="parentId[]" name="parentId[]" value="{$tmp.id}">{$tmp.title}
                        {foreach name="tmp.child" id="childTmp"}
                        <div class="col-sm-8" style="margin-left:30px;">
                            <input class="childId" lay-skin="primary" type="checkbox" lay-filter="childId[]" data-id="{$childTmp.pid}" onclick="danxuan(this)" name="childId[]" value="{$childTmp.id}">{$childTmp.title}
                        </div>
                        {/foreach}
                    </div>
                    {/volist}
                </div>
            </div>
            <div class="layui-form-item">
                <label for="L_repass" class="layui-form-label">
                </label>
                <input type="hidden" name="id" value="{$data.id}">
                <button  class="layui-btn" lay-filter="add" lay-submit="" onclick="return edit()">
                    提交
                </button>
            </div>
        </form>
    </div>
</div>
<script>layui.use(['form', 'layer'],
    function() {
        $ = layui.jquery;
        var form = layui.form,
            layer = layui.layer;

        var ids = '{$data.rules}';
        var id = ids.split(',');
        for(var i = 0; i<id.length; i++){
            //console.log($("[value='"+id[i]+"']"));
            $("[value='"+id[i]+"']").prop('checked',true);
            form.render('checkbox');
        }
        form.on('checkbox(parentId[])', function(data){
            var a = data.elem.checked;
            if(a == true){
                $(data.elem).nextAll('.col-sm-8').children().prop("checked", true);
                form.render('checkbox');
            }else {
                $(data.elem).nextAll('.col-sm-8').children().prop("checked", false);
                form.render('checkbox');
            }
        });
        form.on('checkbox(childId[])', function(data){
            var a = data.elem.checked;
            console.log(data.elem);
            if(a == true){
                $(data.elem).parent('div').parent('div').children('input').prop('checked',true);
                //$(data.elem).nextAll('.col-sm-8').children().prop("checked", true);
                form.render('checkbox');
            }else {
                $(data.elem).parent('div').parent('div').children('input').prop('checked',true);
                form.render('checkbox');
            }
        });


    });

function edit()
{
    var param = $('form').serializeArray();
    if(param.length==0){
        param = {'parentId':'','childId':''};
    }
    var url = '{:url("AuthGroup/edit")}';
    var loading = layer.msg(0, {shade: false});
    //console.log(param);return false;
    $.ajax({
        type:"POST",
        url:url,
        data:param,
        success:function(res){
            layer.close(loading);
            if(res.code>0){
                layer.msg(res.msg,{icon:1,time:1500});
                setTimeout(function(){
                    window.parent.location.reload();
                },1500);
            }else{
                layer.msg(res.msg,{icon:5,time:1500});
            }
        }
    });
}


</script>

</body>

</html>
